/**
 * Licensed to Jasig under one or more contributor license
 * agreements. See the NOTICE file distributed with this work
 * for additional information regarding copyright ownership.
 * Jasig licenses this file to you under the Apache License,
 * Version 2.0 (the "License"); you may not use this file
 * except in compliance with the License. You may obtain a
 * copy of the License at:
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on
 * an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied. See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

/* uPORTAL UNIVERSALITY THEME LAYOUT CSS
 * These declarations are scoped both for the portal and for portlets.
 * These declarations are specific to the "universality" theme.
 * This CSS is shared across all skins that use the "universality" theme.
 * These declarations work with the Fluid Skinning System (FSS) to establish the basic portal layout structure.
 * Only CSS that affects the layout (positioning) of major elements should be listed here.  Such as:
 *   display, position, float, clear, width, height, min-width, min-height, margin, border, padding, overflow
 * CSS that sets the visual style of the portal (and portlets) is handled by individual skins.
 * This CSS assumes the use of a CSS reset (by default the FSS "fss-reset.css") for browser normalization.
 */
 
/* uPORTAL DEVELOPMENT STANDARDS AND GUIDELINES
 * For the standards and guidelines that govern the user interface of uPortal portlets including HTML, CSS, JavaScript, accessibilty, naming conventions, 3rd Party libraries (like jQuery and the Fluid Skinning System) and more, refer to:
 * http://www.ja-sig.org/wiki/x/cQ
 */
 
 
/* 
----------------------------------------------------
  Fluid Skinning System extensions and overrides.
----------------------------------------------------
 * The Fluid Skinning System is a group of CSS files with a specially designed modular structure and class-specific format.
 * It is meant to work well as both a standalone CSS foundation for your site and Fluid Infusion components.
 * In FSS, "themes" refer to the color schemes and "window dressings" for basic markup and FSS Helpers, such as Tabs, Widgets, Menus, etc.
 * For more information on FSS themes, refer to:
 * http://wiki.fluidproject.org/x/egNS
 * The FSS theme created for uPortal is "fl-theme-uportal", and is a class of the <body> tag, used for namespacing.

/* Custom fl classes for use with the Sidebar. */
.fl-col-mixed .fl-container-flex-left {margin-left:200px;}
.fl-col-mixed .fl-container-flex-right {margin-right:200px;}
.fl-col-mixed-100 .fl-container-flex-left {margin-left:100px;}
.fl-col-mixed-100 .fl-container-flex-right {margin-right:100px;}
.fl-col-mixed-150 .fl-container-flex-left {margin-left:150px;}
.fl-col-mixed-150 .fl-container-flex-right {margin-right:150px;}
.fl-col-mixed-200 .fl-container-flex-left {margin-left:200px;}
.fl-col-mixed-200 .fl-container-flex-right {margin-right:200px;}
.fl-col-mixed-250 .fl-container-flex-left {margin-left:250px;}
.fl-col-mixed-250 .fl-container-flex-right {margin-right:250px;}
.fl-col-mixed-300 .fl-container-flex-left {margin-left:300px;}
.fl-col-mixed-300 .fl-container-flex-right {margin-right:300px;}


/* Reset: tabs. */
.fl-tabs {margin: 0 0 0 0; border-bottom: none; text-align: inherit; padding-bottom:0;}
.fl-tabs li {list-style-type: none; display:inline;}
.fl-tabs li a {padding:0 0 0 0; background-color: transparent; margin-left: 0; *margin-bottom: 0px; zoom:1; border: none; color:#999;}
.fl-tabs .fl-reorderer-dropMarker {padding:0 3px; background-color:#c00; margin:0 5px 0 -5px; zoom:1;}
.fl-tabs .fl-tabs-active a {padding:0; border-bottom: none; color:#000;}
.fl-tabs-content {padding: 0;}
.fl-tabs-center {text-align: center;}
.fl-tabs-left {text-align: left; padding-left: 10px;}
.fl-tabs-right {text-align: right; padding-right: 15px;}


/* Reset: mist theme. */
.fl-theme-mist .fl-tabs {border: none; border-bottom: none; margin: 0; padding-bottom: 0;}
.fl-theme-mist .fl-tabs li,
.fl-theme-mist .fl-tabs li a {font-weight: bold; border: none; background-color: transparent; color: #555555;}
.fl-theme-mist .fl-tabs li a:hover {background-color: transparent; color: #222222;}
.fl-theme-mist .fl-tabs li.fl-activeTab,
.fl-theme-mist .fl-tabs li.fl-activeTab:hover,
.fl-theme-mist .fl-tabs li.fl-activeTab a,
.fl-theme-mist .fl-tabs li.fl-activeTab a:hover,
.fl-theme-mist .fl-tabs li.fl-tabs-active,
.fl-theme-mist .fl-tabs li.fl-tabs-active a,
.fl-theme-mist .fl-tabs li.fl-tabs-active a:hover {background-color: transparent; color: #222222;}
.fl-theme-mist .fl-tabs-content {background-color: transparent; border: none; margin-top: 0;}


/* Reset: coal theme. */
.fl-theme-coal .fl-tabs {}
.fl-theme-coal .fl-tabs li,
.fl-theme-coal .fl-tabs li a {font-weight: bold; color: #FFF; background-color: transparent; text-decoration: none;}
.fl-theme-coal .fl-tabs li a:hover {background-color: transparent; color:#FFF;}
.fl-theme-coal .fl-tabs li.fl-activeTab,
.fl-theme-coal .fl-tabs li.fl-activeTab:hover,
.fl-theme-coal .fl-tabs li.fl-activeTab a,
.fl-theme-coal .fl-tabs li.fl-activeTab a:hover,
.fl-theme-coal .fl-tabs li.fl-tabs-active,
.fl-theme-coal .fl-tabs li.fl-tabs-active a,
.fl-theme-coal .fl-tabs li.fl-tabs-active a:hover {background-color: transparent; color:#000;}
.fl-theme-coal .fl-tabs-content {background-color: transparent; color:#000; border: none;}


/* Redefine: mist theme. */
.fl-theme-mist .fl-tabs {padding: 0 0 0 0; text-align: left;}
.fl-theme-mist .fl-tabs li {display: inline-block; position: relative; background-color: #EDEDED; padding: 5px 20px 5px 20px; border-left: 1px solid #EFEFEF; border-right: 1px solid #D3D3D3;
    border-top: 1px solid #D3D3D3; cursor: pointer; white-space: nowrap;}
.fl-theme-mist .fl-tabs li:hover {background-color: #DADADA;}
.fl-theme-mist .fl-tabs li.fl-tabs-active,
.fl-theme-mist .fl-tabs li.fl-tabs-active:hover,
.fl-theme-mist .fl-tabs li.fl-activeTab,
.fl-theme-mist .fl-tabs li.fl-activeTab:hover {background-color: #FFF;}


/* Redefine: coal theme. */
.fl-theme-coal .fl-tabs {padding: 0 0 0 0; text-align: left;}
.fl-theme-coal .fl-tabs li {display: inline-block; position: relative; background-color: #666; padding: 5px 20px 5px 20px; border-left: 1px solid #333; border-right: 1px solid #333;
    border-top: 1px solid #333; cursor: pointer; white-space: nowrap;}
.fl-theme-coal .fl-tabs li:hover {background-color: #333;}
.fl-theme-coal .fl-tabs li.fl-tabs-active,
.fl-theme-coal .fl-tabs li.fl-tabs-active:hover,
.fl-theme-coal .fl-tabs li.fl-activeTab,
.fl-theme-coal .fl-tabs li.fl-activeTab:hover {background-color: #EBEBEB;}


/* Redefine: focus
:focus,
.fl-theme-mist :focus, .fl-theme-mist .selectable,
.fl-theme-coal :focus, .fl-theme-coal .selectable {outline:1px dotted #CCC;}
 */
/* 
------------------------------------
  uPortal Layout and Structure.
------------------------------------ 
 * uPortal is namespaced with "up", a class of the <body> tag.
 */

/* Forms */
input[type="checkbox"] {margin-right:0.5em;}
fieldset input[type="checkbox"] {margin-bottom:1em;}


/* Buttons */
/*
 * Gives links and form buttons a consistent button look.
 * If multiple buttons, add the "buttons" class to the wrapping element.
 * If multiple buttons, add the "primary" class to the default action.
 */
.button,
form input[type="submit"] {margin:0 5px; padding:2px 10px;}
a.button {display:inline-block;}
.buttons {padding:1em 0;}
.button:hover {cursor:pointer;}


/* Common */
.portal-pipe {padding:0 0.5em;}

ul.horizontal-list-floated li {list-style:none; float:left; padding-left:1em;}
ul.horizontal-list-inline li {list-style:none; display:inline; padding-left:1em;}


/* Add the "purpose-layout" class to any table you are using for layout purposes. */
table.purpose-layout,
table.purpose-layout th,
table.purpose-layout td {margin:0; padding:0;}


/* Page */
#portalPage {min-width:750px; clear:both;}


/* Header */
#portalPageHeader {position:relative;}
#portalPageBar {padding:0.5em 0;}
#portalPageBar h2 {margin:0; padding:0.5em 0 0 1em; position:absolute; top:0; left:0;}
#portalPageBarLinks ul,
#portalPageBarLinks li {margin:0; padding:0; display:inline;}
#portalPageBarLinks li {list-style-type:none;}
#portalPageBarLinks a {padding:0 0.5em;}
#portalSkipNav a, 
#portalSkipNav a:hover, 
#portalSkipNav a:visited {position:absolute; left:0; top:-500px; width:1px; height:1px; overflow:hidden;} /* This sets the skip-to links to be completely hidden until a user tabs to the link. */
#portalSkipNav a:active, 
#portalSkipNav a:focus {position:static; width:auto; height:auto;} /* This sets the skip-to links to be completely hidden until a user tabs to the link. */
#portalLogo {}
#portalWelcome {display:inline; padding-right:2em;}
.focused #portalPageBar img {float:left; margin:3px 0 0 10px}


/* Body */
#portalPageBodyTitleRowContents {position:relative; padding:0 1em;} /* Sets this container as positioned to have other elements poisitioned relative to it. */
.breadcrumb-separator {padding:0 0.5em;}
#portalPageBodyTitleRow h1 {margin:0;}


/* Columns */
.portal-page-column {float:left; display:inline;}
.portal-page-column-inner {padding-bottom:1em; min-height:100px;}
.columns-1 .column-1 {width:100%;}
.columns-2 .column-1 .portal-page-column-inner,
.columns-3 .column-1 .portal-page-column-inner,
.columns-4 .column-1 .portal-page-column-inner,
.columns-3 .column-2 .portal-page-column-inner,
.columns-4 .column-2 .portal-page-column-inner,
.columns-4 .column-3 .portal-page-column-inner {margin-right:5px}
.columns-2 .column-2 .portal-page-column-inner,
.columns-3 .column-3 .portal-page-column-inner,
.columns-4 .column-4 .portal-page-column-inner {margin-left:5px}

/* Sidebar */
#portalSidebar {padding:0;}
#portalSidebarInner {padding:0 1em 2em 1em;}
#portalSidebar #portalCustomizationLinks .portal-pipe {display:none;}
/* Sidebar Widgets & Navigation*/
#portalSidebar .fl-widget {padding:7px; font-size:85%;}
#portalSidebar .fl-widget .fl-widget-titlebar {margin:0;}
#portalSidebar .fl-widget .fl-widget-titlebar h2 {font-size:1em; font-weight:bold; border:none;}
#portalSidebar .fl-widget-content,
#portalSidebar .fl-widget .fl-listmenu {padding: .1em; border-width: 0px; border-bottom-width: 1px;}
#portalSidebar .fl-widget .fl-listmenu ul{margin: 0;}
#portalSidebar .fl-widget .fl-listmenu a {padding-left:28px; background-image:url(/ResourceServingWebapp/rs/famfamfam/silk/1.3/application.png); background-position:0.5em 0.5em; background-repeat:no-repeat;}
#portalSidebar .fl-widget .fl-listmenu li,
#portalSidebar .fl-widget .fl-listmenu li a {overflow: visible; *overflow: hidden; border: none;}
#portalSidebar .fl-widget .fl-listmenu li {border: none; position: relative;}
#portalSidebar .fl-widget .fl-listmenu li.first {border-left: none;}
#portalSidebar .fl-widget .fl-listmenu li:hover,
#portalSidebar .fl-widget .fl-listmenu li:focus,
#portalSidebar .fl-widget .fl-listmenu li a:hover,
#portalSidebar .fl-widget .fl-listmenu li a:focus {outline:none;}
/* Sidebar Subnavigation */
#portalSidebar #portalNavigationInner {padding:0; background-color: transparent;}
#portalSidebar .fl-widget .fl-listmenu li.fl-activemenu .portal-subnav-list a {padding-left:40px; padding-bottom: 7px; background-position:1.7em 0.5em; font-size: 83%;}
/* Sidebar Navigation: Icons */
#portalSidebar #portalNavigation .portal-navigation-add,
#portalSidebar #portalNavigation .portal-navigation-delete,
#portalSidebar #portalNavigation .portal-navigation-gripper {display: none;}
#portalSidebar #portalNavigation .active .portal-navigation-gripper {display: block; position: absolute; text-decoration: none; border: none;}
#portalSidebar #portalNavigation .portal-navigation-add:hover,
#portalSidebar #portalNavigation .portal-navigation-delete:hover {background-position: 0px -16px;}
#portalSidebar #portalNavigation .portal-navigation-delete,
#portalSidebar #portalNavigation .portal-navigation-delete span,
#portalSidebar #portalNavigation .active .portal-navigation-gripper,
#portalSidebar #portalNavigation .active .portal-navigation-gripper span {display: block; width: 16px; height: 16px; overflow: hidden;}
#portalSidebar #portalNavigation .active .portal-navigation-delete span,
#portalSidebar #portalNavigation .active .portal-navigation-gripper span {visibility: hidden;}
#portalSidebar #portalNavigation .portal-navigation-add {height:16px; top: 1px; left: auto; right: 2px; padding:0px 0px 0px 16px; color: #000; text-transform: capitalize; background: transparent url("../images/add.png") 0px 0px no-repeat;}
#portalSidebar #portalNavigation .active .portal-navigation-gripper {top: 0px; left: auto; right: 18px; cursor: move; background: transparent url("../images/gripper.png") 0px 0px no-repeat; padding: 0;}
#portalSidebar #portalNavigation .portal-navigation-delete {top: 0px; right: 0px; cursor: pointer; background: transparent url("../images/remove.png") 0px 0px no-repeat; padding: 0;}


/* Portlet Wrappers */
.up-portlet-wrapper {margin-bottom:1em;}
.up-portlet-titlebar {position:relative;}
.up-portlet-titlebar h2 {margin:0; padding:2px 20px 3px 20px;}
.up-portlet-controls {position:absolute; top:4px; right:0;}
.dashboard .up-portlet-controls .up-portlet-control {padding-right:1em;}
.up-portlet-content-wrapper {padding:1em;}
/* No Chrome */
.fl-widget.no-chrome .up-portlet-titlebar {display:none;}
.fl-widget.no-chrome,
.fl-widget.no-chrome .up-portlet-content-wrapper {padding:0; border:none; background:none;}

/* Footer */
#portalPageFooter {}
#portalPageFooterInner {}
#portalProductAndVersion {margin-top:1em;}

/* Login */
#portalLogin label {display:block; margin-bottom:0.3em;}
#portalLogin input {margin-bottom:1em;}

/* Navigation */
#portalNavigationInner {position: relative;}
/* Navigation: Icons (common) */
#portalNavigation .portal-navigation-gripper { display: none }
#portalNavigation .portal-navigation-add,
#portalNavigation .portal-navigation-delete,
#portalNavigation .active .portal-navigation-gripper {display: block; position: absolute; text-decoration: none; border: none;}
#portalNavigation .portal-navigation-add{ position:static }
#portalNavigation .portal-navigation-add:hover,
#portalNavigation .portal-navigation-delete:hover {background-position: 0px -16px;}
#portalNavigation .portal-navigation-delete,
#portalNavigation .portal-navigation-delete span,
#portalNavigation .active .portal-navigation-gripper,
#portalNavigation .active .portal-navigation-gripper span {display: block; width: 16px; height: 16px; overflow: hidden;}
#portalNavigation .portal-navigation-delete span,
#portalNavigation .active .portal-navigation-gripper span {visibility: hidden;}
#portalNavigation .portal-navigation-add {top: 1px; right: 2em;  padding:0px 0px 0px 16px; background: transparent url("../images/add.png") 0px 0px no-repeat;}
#portalNavigation .active .portal-navigation-gripper {top: 0px; left: 0px; cursor: move; background: transparent url("../images/gripper.png") 0px 0px no-repeat; padding: 0;}
#portalNavigation .portal-navigation-delete {top: 0px; right: 0px; cursor: pointer; background: transparent url("../images/remove.png") 0px 0px no-repeat; padding: 0;}
/* Navigation: Subrow */
#portalNavigationSubrow {padding:0.5em 0;}
.sidebar-left-100 #portalNavigationSubrow ul {margin-left:120px;}
.sidebar-left-150 #portalNavigationSubrow ul {margin-left:170px;}
.sidebar-left-200 #portalNavigationSubrow ul {margin-left:220px;}
.sidebar-left-250 #portalNavigationSubrow ul {margin-left:270px;}
.sidebar-left-300 #portalNavigationSubrow ul {margin-left:320px;}
.sidebar-right-100 #portalNavigationSubrow ul {margin-right:120px;}
.sidebar-right-150 #portalNavigationSubrow ul {margin-right:170px;}
.sidebar-right-200 #portalNavigationSubrow ul {margin-right:220px;}
.sidebar-right-250 #portalNavigationSubrow ul {margin-right:270px;}
.sidebar-right-300 #portalNavigationSubrow ul {margin-right:320px;}
#portalNavigationSubrow li {list-style-type:none; display:inline;}
#portalNavigationSubrow a {padding:0em 1em;}
/* Navigation: Flyout */
#portalNavigation .portal-flyout-container {width: 200px; position: absolute; z-index: 100000; display: none;}
#portalNavigation .portal-flyout-container .portal-subnav-list {margin: 0;}
#portalNavigation .portal-flyout-container .portal-subnav-list li {display: list-item; position: static; padding: 0; list-style: none; border: none;}
#portalNavigation .portal-flyout-container .portal-subnav-list li a {display: block; padding:0.7em 2em;}
#portalNavigation .portal-flyout-container .portal-subnav-list li:first-child a {border:none;}
#portalNavigation .portal-flyout-iframe {position:absolute; z-index:9;}
/* Navigation: Flyout (Fix for IE7) */
.on-top {z-index:1000000;}
/* Navigation: Flyout (Legacy) */
#portalNavigation .portal-flyout-container .portal-subnav-list #movePageLeftLink,
#portalNavigation .portal-flyout-container .portal-subnav-list #movePageRightLink,
#portalNavigation .portal-flyout-container .portal-subnav-list #editPageLink,
#portalNavigation .portal-flyout-container .portal-subnav-list #deletePageLink {display: none;}
#portalNavigation .movable .portal-subnav-list #movePageLeftLink,
#portalNavigation .movable .portal-subnav-list #movePageRightLink,
#portalNavigation .editable .portal-subnav-list #editPageLink,
#portalNavigation .deletable .portal-subnav-list #deletePageLink {display: list-item;}


/* Edit Permisssions */
#portalEditPagePermissions {}
#editPagePermissionsLink {float: right; display: block; margin-top: .75em; margin-right: 2em;}


/* Customize Page Message */
#portalPageBodyCustomizeMessageRow {background: transparent; padding-top: 4px; margin-bottom: 1em;}
#portalPageBodyCustomizeMessageRowContents {background-color: #FFF; padding: 10px 20px;}
#portalPageBodyCustomizeMessageRowContents h1 {margin: 0 0 .3em 0; font-weight: normal; border: none;}
#portalPageBodyCustomizeMessageRowContents .fl-font-blue {font-weight: bold;}


/* Quick Links */
#portalQuicklinks {}
#portalQuicklinks ul, 
#portalQuicklinks li {margin:0; padding:0;}


/* Web Search */
#webSearchContainer form {}
#portalPageHeader #webSearchContainer {position:absolute; top:3em; right:2em;}
#portalPageHeader #webSearchContainer h2 {display:none;}
#portalPageHeader #webSearchContainer input,
#portalPageHeader #webSearchContainer select {float:left; margin-left:0.3em;}


/* Tooltip */
#tooltip h3, #tooltip div { margin: 0; }
#tooltip {position:absolute; z-index:3000; opacity:0.85; max-width:400px; padding:4px;}


/* Fragment Administration */
#fragmentAdminForm {margin:0; padding:0;}
#portalFragAdminExit {padding:0.5em 1em;}
#portalFragAdminExit h2,
#portalFragAdminExit .block-content,
#portalFragAdminExit form {display:inline;}
#portalFragAdminExit h2 {padding-right:1em;}
#portalFragAdminExit #exitFragment {margin-left:1em; padding:0.3em 1em;}
.fragment-disabled .add-fragment-link { display:none }


/* Portlet Navigation */
#portletNavigation h3 {margin:0.5em 0 0 0; padding:0.2em 0.5em;}


/* Ajax Menus */
#changeColumns tr td { text-align: center; }
#changeColumns img { vertical-align: middle; padding:3px; }
#skinList {margin-bottom:1.5em;}
#skinList h2 {display:inline; margin-left:0.5em;}
#skinList .fl-widget-content {padding:1em;}


/* 
------------------------------------
  uPortal Gallery.
------------------------------------ 
 * The gallery is a sliding drawer that provides interfaces for customizing the protal.
 */

/* Gallery Layout 
 * Includes Fluid layout overides.
 * Generally the overall layout should not need to be altered.
 * If needed, override these values on a per-skin basis by adding the overrides to portal.css within the desired skin folder.
 */
.clear-float {clear:both;}
.up-gallery {position:relative;}
.up-gallery .gallery-inner {display:none; overflow: hidden; padding-top:7px; height:200px;  position:relative;}
.up-gallery .column-inner {position:relative;}
.up-gallery .menu-wrapper {width:130px; display:block; height:200px; position:relative;}
.up-gallery .content-wrapper {margin:0 0 0 127px; padding:8px 0; display:block; height:174px;}
.up-gallery .content {padding-right:8px; }
.up-gallery .content-filters-wrapper {width:200px; padding:0px; display:block; height:174px; position:relative;}
.up-gallery .content-results-wrapper {margin:0 0 0 220px; display:block; height:172px;}
.up-gallery .content-pager-wrapper {padding:0px; width:70px; display:block; height:170px;}
.up-gallery .content-results-wrapper {padding:0px;}
.up-gallery .skins .content-results-wrapper,
.up-gallery .layouts .content-results-wrapper {margin-left:0px; margin-right:0px;}
.up-gallery .results-wrapper {overflow:hidden; padding-right:1px;}
.up-gallery .fl-col-mixed2 .fl-col-main {padding-left:0px;}
.up-gallery .content .add-content,
.up-gallery .content .use-content {overflow-y: hidden;}


/* Gallery Menu Items 
 * The navigation menu of gallery views.
 */
.up-gallery .menu {height:190px; padding:10px 0 0 0; position:relative; margin-top:0; margin-bottom:0; margin-left:15px; margin-right:auto; width:100px; border-left-width:1px; border-left-style:solid; border-right-width:1px; border-right-style:solid;}
.up-gallery .menu li {position:relative; height:28px; cursor:pointer; list-style:none; margin:0; border-top-width:1px; border-top-style:solid;}
.up-gallery .menu li a {text-decoration: none; cursor: pointer;}
.up-gallery .menu li.last {border-bottom-width:1px; border-bottom-style:solid;}
.up-gallery .menu li span {padding:7px; display:block; height:14px; width:110px; bottom:0; font-weight:bold; font-size:12px;}
.up-gallery .menu li.active span {position:relative;}
.up-gallery .menu li.active:hover,
.up-gallery .menu li.active:focus {outline:none;}
.up-gallery .menu li :focus {outline:none;}
*:first-child+html .up-gallery .menu li {height:25px;}


/* Gallery Handle 
 * Clickable handle that opens the drawer. Once open, the handle can be clicked to close the drawer.
 */
.up-gallery .handle {margin:0; padding:0; position:absolute; bottom:-7px; left:0; right:0; height:7px; clear:both;}
.up-gallery .handle a {width:100px; cursor:pointer; font-size:10px; border-top:0px; position:absolute; top:6px; left:0; margin-left:25px;}
.up-gallery .handle a:hover {text-decoration: none;}
.up-gallery .handle a span {text-transform:uppercase; font-weight:bold; padding:1px 25px 2px 10px; margin-right:5px; display:block;}


/* Gallery Modal Loaders 
 * Preloaders while the content loads, following the opening of the drawer.
 */
.up-gallery .gallery-loader {display: block; margin: 7px 0px 0px 127px; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-image:url("../images/gallery-content-preloader.gif"); background-position:50% 50%; background-repeat:no-repeat;}
.up-gallery .gallery-loader span {display: none;}


/* Gallery Close Button 
 * An explicit close button, that closes the drawer.
 */
.up-gallery .close-button {position:absolute; left:32px; bottom:5px;}


/* Gallery Add/Use Portlet Filters 
 * Search and category filters for the add portlet and use portlet views.
 */
.up-gallery .portlet-search-form {margin-bottom:10px;}
.up-gallery .portlet-search-form label,
.up-gallery .portlet-search-form .portlet-search-submit {display:none;}
.up .up-gallery .portlet-search-form .portlet-search-input {width:157px;}
.up-gallery .categories-column,.up-gallery .packages-column {padding:0;}
.up-gallery .categories,.up-gallery .packages {}
.up-gallery .categories-column, .up-gallery .packages-column {clear:both;}
.up-gallery .content-filters-wrapper h3 {margin:0; padding:5px 0 0 0; cursor:pointer; font-size:12px;}
.up-gallery .content-filters-wrapper h3 span {padding:1px 10px}
.up-gallery .packages-column h3 {position:absolute; top:0; left:56px;}
.up-gallery .categories-column .categories-wrapper, .up-gallery .packages-column .packages-wrapper {display:none;}
.up-gallery .categories-column.active .categories-wrapper, .up-gallery .packages-column.active .packages-wrapper {display:block;}
.up-gallery .packages-wrapper, .up-gallery .categories-wrapper {padding:10px;}
.up-gallery .packages p {margin:0; font-size:11px;}
.up-gallery .categories-column h4 {padding-bottom:1px; margin-bottom:3px; font-size:10px; text-transform:uppercase;}
.up-gallery .categories ul, .up-gallery .categories li, .up-gallery .categories a {list-style:none; margin:0; padding:0; font-size:10px; text-decoration:none;}
.up-gallery .categories li {float:left; padding:1px 0 1px 2px;  text-align:left; cursor:pointer;}
.up-gallery .categories li:after {content:", ";}
.up-gallery .categories li:last-child:after {content:"";}
.up-gallery .categories li.active a {text-decoration:underline;}


/* Gallery List Pager 
 * Pagination controls for lists in the gallery.
 */
.up-gallery .pager-button-up span,
.up-gallery .pager-button-down span {display:none;}
.up-gallery .pager-pagination {height:38px; margin:2px 0 2px 0; font-size:10px;}
.up-gallery .pager-button-up-inner {display:block; height:59px; background: url(../images/gallery-pager-up-active.png) center 85% no-repeat;}
.up-gallery .pager-button-down-inner {display:block; height:59px; background: url(../images/gallery-pager-down-active.png) center 15% no-repeat;}
.up-gallery .pager-button-up.fl-pager-disabled .pager-button-up-inner {background-image: url(../images/gallery-pager-up-inactive.png);}
.up-gallery .pager-button-down.fl-pager-disabled .pager-button-down-inner {background-image: url(../images/gallery-pager-down-inactive.png);}
.up-gallery .pager-button-up,
.up-gallery .pager-button-down {cursor:pointer; position:relative; height:62px;}


/* Gallery Results List 
 * General formatting for results lists (portlets, packages, skins, and layouts).
 */
.up-gallery .results-wrapper {font-size:10px; position:relative;}
.up-gallery .results-wrapper-inner {padding: 0px 5px;}
.up-gallery .results-wrapper .results-list {list-style:none; padding-top: 5px; margin:0; position:relative; width:100%; overflow:hidden;}
.up-gallery .results-wrapper .results-list .results-item,
.up-gallery .results-wrapper .results-list .result-item {margin-right: 5px; margin-bottom:5px;}
.up-gallery .results-wrapper .results-list li {display:block; list-style:none; padding:0; margin:0; position:relative; float:left;}
.up-gallery .results-wrapper .results-list li .ri-wrapper {padding:0px; position:relative;}
.up-gallery .results-wrapper .results-list .skins-wrapper .ri-link,
.up-gallery .results-wrapper .results-list .layout-wrapper .ri-link {display:block; padding:5px;}
.up-gallery .results-wrapper .results-list .ri-link .ri-content {overflow: hidden;}
.up-gallery .results-wrapper a {text-decoration:none;}
.up-gallery .results-column.fl-col-main {margin:0 74px 0 0; padding:0px; position:relative;}
.up-gallery .results-wrapper .pager-column.fl-col-side {float:right; width:74px; margin:0px; padding:0px;}
.up-gallery .ri-titlebar {font-size:11px; font-weight:bold; margin-bottom: 5px;}
.up-gallery .ri-icon {float:left; margin-right:5px;}
.up-gallery .skins-wrapper .ri-icon {margin-right:0;}
.up-gallery .ri-icon span {visibility: hidden;}
.up-gallery .ri-description {clear:right; display:inline;}

/* Gallery Portlet and Package Lists
 * The list of portlets and packages for add and use.
 */
.up-gallery .portlet-list li,
.up-gallery .package-list li {width: 32%; height:50%;}
.up-gallery .portlet-list li .portlet-wrapper,
.up-gallery .package-list li .package-wrapper {height:80px;}
.up-gallery .portlet-wrapper .ri-link,
.up-gallery .package-wrapper .ri-link {position: absolute; top: 0px; right: 0px; display: block; cursor:pointer; padding:2px 8px; text-align:center;}
.up-gallery .portlet-wrapper .ri-icon,
.up-gallery .package-wrapper .ri-icon {width:32px; height:32px;}
.up-gallery .package-wrapper .ri-content,
.up-gallery .portlet-wrapper .ri-content {padding:5px;}
/* Drag Handle */
.up-gallery .portlet-thumb-gripper {display: block; cursor: move;}
.up-gallery .portlet-thumb-gripper span {display: block; width: 16px; height: 16px; overflow: hidden; visibility: hidden;}
/* IE7 adjustments*/
*:first-child+html .up-gallery .results-wrapper .portlet-list li, 
*:first-child+html .up-gallery .results-wrapper .package-list li {width:24%;} 


/* Gallery Skin List 
 * The list of skins.
 */
.up-gallery .skins-wrapper .skin-thumb {width: 120px; height: 70px;}

/* Gallery Layout List 
 * The list of page layouts.
 */
.up-gallery .results-wrapper .layouts-list li {width:140px; height:50%;}
.up-gallery .layout-wrapper .layout-thumb {width: 27px; height:27px;}


/* Gallery: Avatar */
.portlet.ui-draggable-dragging {
    border: 1px solid #F68923; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius-topright:0px; -moz-border-radius-topright:0px; -webkit-border-top-right-radius:0px;
    padding: 0; margin: 0; list-style: none; -moz-box-shadow: 0px 0px 4px 0px #333; -webkit-box-shadow: 0px 0px 4px 0px #333; box-shadow: 0px 0px 4px 0px #333; background: #333; position: relative;
    background-image:-moz-linear-gradient(90deg,#000000,#333333); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#333333)); height: 80px; width: auto;
    overflow: hidden; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80);}
.portlet.ui-draggable-dragging .portlet-wrapper {overflow: hidden;}
.portlet.ui-draggable-dragging .portlet-wrapper-inner {padding:0px 10px 0px 10px; position: relative;}
.portlet.ui-draggable-dragging .portlet-thumb-link {
    position: absolute; top: 0px; right: 0px; display: block; color: #000; text-decoration: none; font-size: 77%; padding: 2px 8px; background: #666; background-image: -moz-linear-gradient(90deg,#666,#ffffff); 
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666), to(#ffffff)); text-align: center; cursor: move; background: #F68923; background-image: -moz-linear-gradient(90deg,#F68923,#ffffff);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F68923),to(#ffffff));}
.portlet.ui-draggable-dragging .portlet-thumb-gripper {
    display: block; background: #444444 url("../images/gripper.png") 5px 0px no-repeat; cursor: move; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px;}
.portlet.ui-draggable-dragging .portlet-thumb-gripper span {display: block; width: 16px; height: 16px; overflow: hidden; visibility: hidden;}
.portlet.ui-draggable-dragging .portlet-thumb-titlebar {padding: 5px 8px 3px 8px; font-size:11px; font-weight:bold; color:#DDD;}
.portlet.ui-draggable-dragging .portlet-thumb-content {padding: 0px 8px 0px 8px;}
.portlet.ui-draggable-dragging .portlet-thumb-icon {width:37px; height:37px;}
.portlet.ui-draggable-dragging .portlet-thumb-icon span {visibility: hidden;}
.portlet.ui-draggable-dragging .portlet-thumb-description {color: #AAA; padding: 0; margin-left: 36px; font-size: 11px;}


/* Gallery: Drop Target */
.layout-draggable-drop-target {display: none; background: #FF0000; padding: 5px; height: 150px; text-align: center; margin-bottom: 1em;  border: 2px dotted #960000; font-weight: bold; color: #960000;}
.layout-draggable-drop-target span {display: block; padding: 65px 5px 5px 5px;}
.layout-draggable-drop-target-active {}
.layout-draggable-target-dropped {border: 1px solid #CCC; background: #EFEFEF url("../../uportal3/images/loading.gif") 50% 50% no-repeat;}
.layout-draggable-target-dropped span {display:none;}


/* Fluid Layout Customizer (Generic: drag and drop) */
.fl-reorderer-movable-hover {cursor:move;}
.fl-reorderer-movable-dragging-mouse {display:none;}
.fl-reorderer-movable-dragging {filter:alpha(opacity=50); opacity:.5;}
.fl-reorderer-movable-selected {outline-color: #F68922;}
.fl-reorderer-avatar {background-color:#fff; border:1px dotted #999; width:auto; filter:alpha(opacity=60); opacity:.6;}
.fl-reorderer-dropMarker {height:200px !important; background-color:#FF0000; border:2px dotted #960000; margin-bottom:1em;}
.drop-warning {position:absolute; top:50px; left:10px; border:2px solid red; background-color:#ffd7d7; display:none; padding:10px; margin:5px; z-index:65535;}
.drop-warning p {margin:0em; padding:0.5em 1em;}


/* Fluid Layout Customizer (Header: drag and drop) */
/* Avatar Icons (common) */
.fl-reorderer-header-avatar .portal-navigation-delete,
.fl-reorderer-header-avatar .portal-navigation-gripper {display: block; position: absolute; padding: 0; border: none; text-decoration: none;}
.fl-reorderer-header-avatar .portal-navigation-delete,
.fl-reorderer-header-avatar .portal-navigation-delete span,
.fl-reorderer-header-avatar .portal-navigation-gripper,
.fl-reorderer-header-avatar .portal-navigation-gripper span {display: block; width: 16px; height: 16px; overflow: hidden;}
.fl-reorderer-header-avatar .portal-navigation-delete span,
.fl-reorderer-header-avatar .portal-navigation-gripper span {visibility: hidden;}
/* Avatar */
.fl-reorderer-header-avatar {display: inline; position: relative; padding: 5px 20px 5px 20px; cursor: pointer; background-color: #FFF; border: 2px solid #F68922; filter:alpha(opacity=70); opacity:.7;}
.fl-reorderer-header-avatar .portal-navigation-link {color: #222222 !important; text-decoration: none;}
.fl-reorderer-header-avatar .portal-navigation-delete {top: 0px; right: 0px; cursor: pointer; background: transparent url("../images/remove.png") 0px 0px no-repeat;}
.fl-reorderer-header-avatar .portal-navigation-gripper {top: 0px; left: 0px; cursor: move; background: transparent url("../images/gripper.png") 0px 0px no-repeat;}
.fl-reorderer-header-avatar .portal-flyout-container{display: none !important;}
/* Drop Marker */
.fl-reorderer-header-dropMarker { + display: block; float:left; + border: 1px solid #d26600 !important; background-color: #F68922 !important; margin: 0 2px !important; filter:alpha(opacity=80) !important; opacity:.8 !important; padding: .5em .31em !important; *display: inline !important; *height: 10px; *padding: 0em .13em !important; *zoom: 1 !important;}

/* Fluid Layout Customizer (Sidebar: drag and drop) */
/* Avatar Icons (common) */
.fl-reorderer-sidebar-avatar .portal-navigation-delete,
.fl-reorderer-sidebar-avatar .portal-navigation-gripper {display: block; position: absolute; padding: 0; border: none; text-decoration: none;}
.fl-reorderer-sidebar-avatar .portal-navigation-delete,
.fl-reorderer-sidebar-avatar .portal-navigation-delete span,
.fl-reorderer-sidebar-avatar .portal-navigation-gripper,
.fl-reorderer-sidebar-avatar .portal-navigation-gripper span {display: block; width: 16px; height: 16px; overflow: hidden;}
.fl-reorderer-sidebar-avatar .portal-navigation-delete span,
.fl-reorderer-sidebar-avatar .portal-navigation-gripper span {visibility: hidden;}
/* Avatar */
.fl-reorderer-sidebar-avatar {display: inline; position: relative; padding: 5px 0 5px 20px; width: 150px; height: 30px; overflow: hidden; cursor: pointer; background-color: #FFF; border: 2px solid #F68922; filter:alpha(opacity=70); opacity:.7;}
.fl-reorderer-sidebar-avatar .portal-navigation-link {color: #222222 !important; text-decoration: none;}
.fl-reorderer-sidebar-avatar .portal-navigation-delete {top: 0px; right: 0px; cursor: pointer; background: transparent url("../images/remove.png") 0px 0px no-repeat;}
.fl-reorderer-sidebar-avatar .portal-navigation-gripper {top: 0px; left: auto; right: 18px; cursor: move; background: transparent url("../images/gripper.png") 0px 0px no-repeat;}
.fl-reorderer-sidebar-avatar .portal-flyout-container, .up .fl-reorderer-sidebar-avatar .portal-subnav-list{display: none !important;}
/* Drop Marker */
.fl-reorderer-sidebar-dropMarker {display: inline-block; border: 1px solid #d26600 !important; background-color: #F68922 !important; margin: 0 2px !important; filter:alpha(opacity=80) !important;
    opacity:.8 !important; padding: .31em 1em !important; *display: inline !important; *height: 10px; *padding: 0em .13em !important; *zoom: 1 !important;}
    
#guestLocaleSelection .portlet .portlet-form { background-color: #fff; border: none; width: auto; }
#guestLocaleSelection .portlet .portlet-form li { margin:0 0 5px 30px; }
#guestLocaleSelection .portlet .portlet-form form .buttons { margin: 0 0 0 50px; }